<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>个人主页</title>


    <!-- Expand styles -->
    <link href="../css/app/app.css" rel="stylesheet">
    <link href="../css/app/default.css" rel="stylesheet">
    <link href="../css/mui/mui.css" rel="stylesheet">


    <!-- Custom styles for this template -->
    <!-- <link href="../css/iOS/mobile/mobile.css" rel="stylesheet"> -->
</head>

<body>

    <div>
        <div class="widget-body bc-head display-flex ">
            <div class="display-flex flex-column align-items-center width20">
                <img class="person-img" src="../img/headimg.png" alt="">
                <span class="white font-17 text-center padding-t-10 elli1 userName"></span>
            </div>
            <div class="margin-l-10 width-100 padding-t-10">
                <div class="display-flex justify-content-around align-items-center white">
                    <div class="display-flex flex-column align-items-center" onclick="goGanZhu()">
                        <span class="font-18 font-weight text-center guanzhu">0</span>
                        <span class="white font-13 text-center">关注</span>
                    </div>
                    <div class="display-flex flex-column align-items-center" onclick="goFenSi()">
                        <span class="font-18 font-weight text-center fensi">0</span>
                        <span class="white font-13 text-center">粉丝</span>
                    </div>
                    <div class="display-flex flex-column align-items-center">
                        <span class="font-18 font-weight text-center shiping">0</span>
                        <span class="white font-13 text-center">视频</span>
                    </div>
                </div>
                <div class="add-pay isGuanzhu" status="" id="">
                    +关注
                </div>
            </div>
        </div>
        <div class="mobile-content5">

            <div class="widget-default margin-b-5">
                <div class="farming-tab-two diff-fixed">
                    <div id="segmentedControl" class="mui-segmented-control">
                        <a class="mui-control-item mui-active" sourceType="AGRT_TECH_VIDEO">农技视频</a>
                        <a class="mui-control-item" sourceType="SMALL_VIDEO">小视频</a>
                    </div>
                </div>
            </div>
            <div id="pullrefresh" class="mui-content mui-scroll-wrapper  " style="margin-top: 190px;">
                <div class="mui-scroll">
                    <!-- 关注 -->
                    <div class="mui-control-content mui-active">
                        <div id="expertListDiv">

                            <!-- 视频列表 -->
                            <div id="videoList">
                            </div>
                        </div>
                    </div>
                </div>

            </div>



        </div>
        <!-- <div class="hobby-footer1">
            <div class="display-flex align-items-center bot-issue">
                <img class="issue-img" src="../img/issue.png" alt="">
            </div>

        </div> -->




        <script src="../js/dsbridge.js"></script>
        <script src="../js/jquery.js"></script>
        <script src="../js/mui/mui.js"></script>
        <script src="../js/mui/mui.picker.min.js"></script>
        <script src="../js/layer.js"></script>
        <script src="../js/app/app-base.js"></script>
        <script src="../js/app/app-url.js"></script>
        <script src="../js/app/app-ajax.js"></script>

        <script>
            var personUserId = localStorage.getItem("person-id");
            var page = 1;
            var limit = 10;
            var index = 0;
            var all_data = new Array();
            //页面类型  
            var sourceType = 'home_page';
            var type = 'AGRT_TECH_VIDEO';
            //点赞数据index
            var praiseIndex = -1;
            //分享数据index
            var shareIndex = -1;

            $(document).ready(function () {
                initPerson();
                mui.init({
                    pullRefresh: {
                        container: '#pullrefresh',
                        down: {
                            auto: true, // 首次进入自动加载
                            callback: pulldownRefresh
                        },
                        up: {
                            contentrefresh: '正在加载...',
                            callback: pullupRefresh
                        }
                    }
                });

            })

            //一级类型切换
            mui("#segmentedControl").on('tap', '.mui-control-item', function () {
                type = $(this).attr("sourceType");

                pulldownRefresh();
            });

            //关注
            mui(".widget-body").on('tap', '.isGuanzhu', function () {

                thisId = personUserId;
                thisStatus = $(this).attr("status");
                if (thisStatus == 1 || thisStatus == 2) {
                    var data = {
                        userId: getUserId(),
                        itemId: thisId,
                        actionType: 5
                    }
                    getServerData(url_oper_action_cancel, data);
                }
                if (thisStatus == 0) {
                    var data = {
                        userId: getUserId(),
                        itemType: 20,
                        itemId: thisId,
                        channel: 2,
                        actionType: 5
                    }
                    getServerData(url_oper_action, data);
                }

            });


            function goGanZhu() {
                localStorage.setItem("logged-person-id", personUserId);
                dsBridge.call("goGuanZhu");
            }

            function goFenSi() {
                localStorage.setItem("logged-person-id", personUserId);
                dsBridge.call("goFenSi");
            }

            function initPerson() {
                var data = {
                    userAccId: getUserId(),
                    personUserId: personUserId,
                }
                getServerData(url_getPersonVO, data);
            }


            /**
             * 下拉刷新具体业务实现
             */
            function pulldownRefresh() {
                page = 1;
                var data = {
                    sourceType: sourceType,
                    userAccId: getUserId(),
                    userId: personUserId,
                    type: type,
                    page: page,
                    limit: limit
                }
                getServerData(url_agrivideoInfo_queryList, data);
            }

            /**
             * 上拉加载具体业务实现
             */
            function pullupRefresh() {
                page++;
                var data = {
                    sourceType: sourceType,
                    userAccId: getUserId(),
                    userId: personUserId,
                    type: type,
                    page: page,
                    limit: limit
                }
                getServerData(url_agrivideoInfo_queryList, data);
            }


            function getServerDataSuccess(url, data) {
                switch (url) {
                    //详情
                    case url_getPersonVO:

                        var obj = data.data;
                        if (!isEmpty(obj.headPortrait)) {
                            $(".person-img").attr("src", showSmallImg(obj.headPortrait));
                        }
                        $(".guanzhu").html(obj.followNum);
                        $(".fensi").html(obj.fansNum);
                        $(".shiping").html(obj.publishVideosNum);
                        $(".userName").html(obj.userName);
                        if (personUserId == getUserId()) {
                            $(".isGuanzhu").html('你自己');
                            $(".isGuanzhu").attr("class", "added-pay");
                            // $(".isGuanzhu").hide();
                        } else {
                            if (obj.isFollow == 1) {
                                $(".isGuanzhu").html('已关注');
                                $(".isGuanzhu").attr("class", "added-pay isGuanzhu");
                            } else if (obj.isFollow == 2) {
                                $(".isGuanzhu").html('互相关注');
                                $(".isGuanzhu").attr("class", "added-pay isGuanzhu");
                            }
                            $(".isGuanzhu").attr("status", obj.isFollow)
                            $(".isGuanzhu").attr("id", personUserId);
                        }

                        break;
                    case url_agrivideoInfo_queryList:
                        var list = data.data;
                        if (page == 1) {
                            index = 0;
                            all_data.length = 0;
                        }
                        var h5 = '';
                        if (list != null && list.length > 0) {
                            if (sourceType != 'SMALL_VIDEO') {
                                $.each(list, function (index, item) {
                                    all_data.push(item);
                                    h5 += '<div class="widget-body widget-default margin-b-5 padding-t-158" id="' + index + '" >' +
                                        '<div class="display-flex padding-b-10">' +
                                        '<img class="farm-head" src="' + (isEmpty(item.headPortrait) ?
                                            "../img/headimg.png" : showSmallImg(item.headPortrait)) + '" alt="">' +
                                        '<div class="display-flex flex-column justify-content-between margin-l-10">' +
                                        '<span class="elli1 font-weight black font-16 font-weight no-margin">' + item
                                            .userName + '</span><span class="gray font-12">' + item.createTime.substring(0,
                                                10) + '</span>' +
                                        '</div>' +
                                        '</div>' +
                                        '<div class="margin-t-5 trade-list videoDetail" tId="' + index + '">' +
                                        '<img   width="100%" height="177"   src="' + showSmallImg(item.coverImg) + '" alt="">' +
                                        '<p class=" elli1 black font-15 padding-t-15 padding-l-5 no-margin">' + item
                                            .title + '</p>' +
                                        '</div>' +

                                        '<div class="display-flex justify-content-end align-items-center padding-t-6">' +
                                        '<img class="farm-icon evalOper" src="../img/new-expert/info.png" alt="">' +
                                        '<span class="gray font-12 padding-l-5 padding-r-10 evalOper">' + item.evaluationNum +
                                        '</span>' +

                                        '<img class="farm-icon shareOper" src="../img/new-expert/share.png" alt="">' +
                                        '<span class="gray font-12 padding-l-5 padding-r-10 shareOper">' + item.shareNum + '</span>' +
                                        '<img class="farm-icon praiseOper praiseImg" src="' + (item.isPraise == 1 ?
                                            "../img/applaud.png" : "../img/zai.png") + '" alt="">' +
                                        '<span class="gray font-12 padding-l-5 praiseOper praiseNum">' + item
                                            .praiseNum + '</span>' +
                                        '</div>' +
                                        '</div>';
                                    index++;
                                })
                            } else {
                                h5 += '<div class="display-flex flex-warp">';
                                $.each(list, function (index, item) {
                                    all_data.push(item);
                                    h5 += '<div class="littlevideo-box videoDetail" id="' + index + '" dId="' + index + '">'
                                        + '<img src="' + showSmallImg(item.coverImg) + '" alt="" class="littlevideo-img">'
                                        + '<div class="littlevideo-shade">'
                                        + '<p class="elli2 white font-12">' + item.title + '</p>'
                                        + '<p class="white font-12">' + item.pageViewNum + '次<span class="padding-l-10">播放</span></p>'
                                        + '</div>'
                                        + '</div>';
                                    index++;
                                })
                                h5 += '</div>';
                            }
                        }

                        if (page == 1) {
                            mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
                            if (list.length > 0) {
                                mui('#pullrefresh').pullRefresh().refresh(true);
                            }
                            $("#videoList").html(h5);
                        } else {
                            $("#videoList").append(h5);
                            mui('#pullrefresh').pullRefresh().endPullupToRefresh(list.length != limit);
                        }

                        break;
                    case url_oper_action_cancel:
                        $("#" + personUserId).attr("class", "add-pay isGuanzhu");
                        $("#" + personUserId).html("+关注");
                        $("#" + personUserId).attr("status", '0');
                        break;
                    case url_oper_action:
                        $("#" + personUserId).attr("class", "added-pay isGuanzhu");
                        var isConcern = data.isConcern;
                        if (isConcern == 0) {
                            $("#" + personUserId).html("已关注");
                            $("#" + personUserId).attr("status", '1');

                        } else if (isConcern == 1) {
                            $("#" + personUserId).html("互相关注");
                            $("#" + personUserId).attr("status", '2');
                        }
                        break;
                    case url_commonoper_operAction + '?type=praise':
                        $(".widget-body[id='" + praiseIndex + "']").find(".praiseImg").attr("src", "../img/applaud.png");
                        var $praiseNum = $(".widget-body[id='" + praiseIndex + "']").find(".praiseNum");
                        var praiseNum = Number($praiseNum.text()) + 1;
                        $praiseNum.text(praiseNum);
                        break;
                    case url_oper_action_cancel + '?type=praise':
                        //取消点赞
                        $(".widget-body[id='" + praiseIndex + "']").find(".praiseImg").attr("src", "../img/zai.png");
                        var $praiseNum = $(".widget-body[id='" + praiseIndex + "']").find(".praiseNum");
                        var praiseNum = Number($praiseNum.text()) - 1;
                        if (praiseNum < 0) {
                            praiseNum = 0;
                        }
                        $praiseNum.text(praiseNum);
                        break;
                }

            }


            function getServerDataFailed(url, data) {
                mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
                mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
            }

            //评论
            mui("#videoList").on('tap', '.evalOper', function () {
                var evalIndex = $(this).parents(".widget-body").attr("id");
                console.log(all_data[evalIndex].id);
                localStorage.setItem("comment-object-id", all_data[evalIndex].id);
                dsBridge.call("goEvalOper");
            });
            //分享
            mui("#videoList").on('tap', '.shareOper', function () {
                shareIndex = $(this).parents(".widget-body").attr("id");
                dsBridge.call("share", all_data[shareIndex]);
            });

            //详情
            mui("#videoList").on('tap', '.videoDetail', function () {
                var detailIndex = $(this).parents(".widget-body").attr("id");
                if (all_data[detailIndex].type == 'AGRT_TECH_VIDEO') {
                    //农技视频
                    localStorage.setItem("video-detail-id", all_data[detailIndex].id);
                    dsBridge.call("goAgriTechVideoDetail", "");
                } else if (all_data[detailIndex].type == 'SMALL_VIDEO') {
                    //小视频
                    dsBridge.call("smallVideo", all_data[detailIndex].id);
                }
            });


            //点赞/取消点赞
            mui("#videoList").on('tap', '.praiseOper', function () {
                praiseIndex = $(this).parents(".widget-body").attr("id");
                if ($(this).parents(".widget-body").find("img.praiseImg").attr("src") == '../img/zai.png') {
                    //点赞
                    var data = {
                        userId: getUserId(),
                        itemType: 19,
                        itemId: all_data[praiseIndex].id,
                        actionType: 2,
                        channel: 2
                    }
                    getServerData(url_commonoper_operAction + '?type=praise', data);
                } else {
                    //取消点赞
                    var data = {
                        userId: getUserId(),
                        itemId: all_data[praiseIndex].id,
                        actionType: 2
                    }
                    getServerData(url_oper_action_cancel + '?type=praise', data);
                }

            });






        </script>


</body>

</html>